<!DOCTYPE html>
<html>
    <head>
          <meta charset="UTF-8">
          <title>二维码分享xx-3</title>
          <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">         
		  <script src="jquery-1.8.3.min.js"></script>
		  <script src="jquery.qrcode.min.js"></script>		                  
		  <script type="text/javascript" >
					
					//从 canvas 提取图片 image
					function convertCanvasToImage(canvas) {
						//新Image对象，可以理解为DOM
						var image = new Image();
						// canvas.toDataURL 返回的是一串Base64编码的URL，当然,浏览器自己肯定支持
						// 指定格式 PNG
						image.src = canvas.toDataURL("image/png");
						return image;
					}					
					$(function() {					
						$("#btnGanerate").click(function(){
						    $('#code').html("");
							$("#code").qrcode({ 
								render:"canvas", //设置渲染方式,qrcode支持canvas和table两种方式进行渲染，默认使用canvas方式 
								width:200, //设置宽度 
								height:200, //设置高度 
								background:"#ffffff",//背景颜色  
								foreground:"#000000",//前景颜色  
								typeNumber: -1,    //计算模式
								//correctLevel: QRErrorCorrectLevel.H,//纠错等级
								text:$("#txtContent").val()//"http://www.studyofnet.com" //任意内容 
							});
							
							//获取网页中的canvas对象

							var mycanvas1=document.getElementsByTagName('canvas')[0];

							//将转换后的img标签插入到html中
                            //$('#imagQrDiv').clear();
							//$('#imagQrDiv').append(img);//imagQrDiv表示你要插入的容器id
							var img=convertCanvasToImage(mycanvas1);
							$('#imagQrDiv').html(img);
							 
						});
						//$("#btnGanerate").click();
					});
			 </script> 
		  
    </head>
    <body>
	           
                <div id="imagQrDiv" style="position:fixed;bottom:0px;left:0px;margin-left:1%;width:400px;height:300px;border:1px solid red;text-align:center;padding-top:30px;"></div>
				<div id="code" style="display:none"></div>               
				<br/>
				<br/>
				<span>Source:</span> <input id="txtContent" type="text" style="width:300px;" value="http://www.studyofnet.com"/>
				<input type="button" id="btnGanerate" value="生成QRCode" />
				
    </body>
  
</html>